<form name="service.$forms.ats" class="service-autoScale-form" novalidate>
    <div class="form-group">
        <label class="margin-right-20">是否启用</label><ctg-switch ng-model="service.atsCheck"></ctg-switch>
    </div>
    <div ng-switch="service.atsTarget" ng-if="service.atsCheck">
        <div class="row">
            <div class="col-md-8">
                <div class="form-group" ng-class="{'has-error': (service.$forms.ats.atsTarget.$touched || service.$forms.ats.$submitted )
                     && service.$forms.ats.atsTarget.$error.required}">
                    <label for="atsTarget">指标</label>
                    <select ng-model="service.atsTarget" class="form-control" name="atsTarget" id="atsTarget" required>
                        <option value="">请选择指标</option>
                        <option value="002">CPU使用量</option>
                        <option value="001">时间周期</option>
                    </select>
                    <div class="text-danger" ng-show="(service.$forms.ats.atsTarget.$touched || service.$forms.ats.$submitted )
                     && service.$forms.ats.atsTarget.$error.required">请选择指标
                    </div>
                </div>
            </div>
            <div class="col-md-4">
                <div class="form-tooltip-group"><i class="fa fa-question"></i>指定自动扩缩策略的基准指标</div>
            </div>
        </div>
        <div class="row">
            <div class="col-md-8">
                <div class="couple-form-group">
                    <div class="couple-form-info">
                        <div class="form-group" ng-class="{'has-error': (service.$forms.ats.minPodNum.$touched || service.$forms.ats.$submitted )
                         && (service.$forms.ats.minPodNum.$error.pattern || service.$forms.ats.minPodNum.$error.required
                         || service.$forms.ats.minPodNum.$error.number)}">
                            <label for="minPodNum">最小容器数</label>
                            <input type="number" ng-model="service.minPodNum" ng-pattern="/^\d+$/"
                                   class="form-control" name="minPodNum" id="minPodNum" placeholder="请输入最小容器数"
                                   required/>
                            <div class="text-danger"
                                 ng-show="(service.$forms.ats.minPodNum.$touched || service.$forms.ats.$submitted)">
                                {{((service.$forms.ats.minPodNum.$error.pattern || service.$forms.ats.minPodNum.$error.required
                                || service.$forms.ats.minPodNum.$error.number) && '请输入有效的最小容器数') || ''}}
                            </div>
                        </div>
                        <div class="form-group text-only">&nbsp;</div>
                        <div class="form-group" ng-class="{'has-error': (service.$forms.ats.maxPodNum.$touched || service.$forms.ats.$submitted )
                         && (service.$forms.ats.maxPodNum.$error.pattern || service.$forms.ats.maxPodNum.$error.required
                         || service.$forms.ats.maxPodNum.$error.min || service.$forms.ats.maxPodNum.$error.number)}">
                            <label for="maxPodNum">最大容器数</label>
                            <input type="number" ng-model="service.maxPodNum" ng-pattern="/^\d+$/" ng-min="+service.minPodNum+1"
                                   class="form-control" name="maxPodNum" id="maxPodNum" placeholder="请输入最大容器数"
                                   required/>
                            <div class="text-danger"
                                 ng-show="(service.$forms.ats.maxPodNum.$touched || service.$forms.ats.$submitted)">
                                {{((service.$forms.ats.maxPodNum.$error.pattern || service.$forms.ats.maxPodNum.$error.required
                                || service.$forms.ats.maxPodNum.$error.number) && '请输入有效的最大容器数')
                                || (service.$forms.ats.maxPodNum.$error.min && '最大容器数必须大于默认分配的容器数') || ''}}
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="col-md-4">
                <div class="form-tooltip-group"><i class="fa fa-question"></i>指定自动扩缩策略的容器范围</div>
            </div>
        </div>
        <div ng-switch-when="002" class="row">
            <div class="col-md-8">
                <div class="form-group" ng-class="{'has-error': (service.$forms.ats.atsLimit.$touched || service.$forms.ats.$submitted )
                             && (service.$forms.ats.atsLimit.$error.required || service.$forms.ats.atsLimit.$error.number
                             || service.$forms.ats.atsLimit.$error.max || service.$forms.ats.atsLimit.$error.min)}">
                    <label for="atsLimit">阈值</label>
                    <div class="input-group">
                        <input type="number" min="50" max="100" ng-model="service.atsLimit" name="atsLimit"
                               id="atsLimit" class="form-control" placeholder="请输入上限值" required>
                        <span class="input-group-addon">%</span>
                    </div>
                    <div class="text-danger" ng-show="(service.$forms.ats.atsLimit.$touched || service.$forms.ats.$submitted )
                         && (service.$forms.ats.atsLimit.$error.required || service.$forms.ats.atsLimit.$error.number
                         || service.$forms.ats.atsLimit.$error.max || service.$forms.ats.atsLimit.$error.min)">请输入有效的阈值
                        (50%~100%)
                    </div>
                </div>
            </div>
        </div>
        <div ng-switch-when="001">
            <div class="row">
                <div class="col-md-8">
                    <div class="couple-form-group">
                        <div class="couple-form-info">
                            <div class="form-group" ng-class="{'has-error': (service.$forms.ats.startTime.$touched || service.$forms.ats.$submitted )
                                    && !service.atsStartTime}">
                                <label for="startTime">开始时间</label>
                                <div class="input-group">
                                    <input id="startTime" name="startTime" id="startTime" min-Date="ats.atsMinDate"
                                           maxlength="50"
                                           class="form-control" ui-datepicker-popup type="text" ng-model="service.atsStartTime"
                                           view="datetime" format="yyyy-MM-dd HH:mm:ss" placeholder="请选择开始时间" required/>
                                    <span class="input-group-addon">{{ats.atsStartDayOfWeek}}</span>
                                </div>
                                <div class="text-danger" ng-show="(service.$forms.ats.startTime.$touched || service.$forms.ats.$submitted )
                                && !service.atsStartTime">请选择开始时间
                                </div>
                            </div>
                            <div class="form-group text-only">&nbsp;</div>
                            <div class="form-group" ng-class="{'has-error': (service.$forms.ats.endTime.$touched || service.$forms.ats.$submitted )
                                    && !service.atsEndTime}">
                                <label for="endTime">结束时间</label>
                                <div class="input-group">
                                    <input id="endTime" name="endTime" id="endTime" min-Date="ats.atsMinDate" maxlength="50"
                                           class="form-control" ui-datepicker-popup type="text" ng-model="service.atsEndTime"
                                           view="datetime" format="yyyy-MM-dd HH:mm:ss" placeholder="请选择结束时间" required/>
                                    <span class="input-group-addon">{{ats.atsEndDayOfWeek}}</span>
                                </div>
                                <div class="text-danger" ng-show="(service.$forms.ats.endTime.$touched || service.$forms.ats.$submitted )
                                && !service.atsEndTime">请选择结束时间
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-md-4">
                    <div class="form-tooltip-group"><i class="fa fa-question"></i>指定自动扩缩策略的时间范围</div>
                </div>
            </div>
            <div class="row">
                <div class="col-md-8">
                    <div class="form-group">
                        <label for="atsSpace">重复</label>
                        <div class="input-group">
                            <select class="form-control" ng-model="service.atsSpace" id="atsSpace"
                                    ng-change="ats.spaceChange(service);ats.setSpaceInst(service)"
                                    ng-options="opt.val as opt.desc for opt in ats.atsSpaceOpts">
                            </select>
                            <span class="input-group-addon">{{ats.atsSpaceInst}}</span>
                        </div>
                    </div>
                </div>
                <div class="col-md-4">
                    <div class="form-tooltip-group"><i class="fa fa-question"></i>指定时间周期的重复策略</div>
                </div>
            </div>
        </div>
    </div>
</form>